<template>
	<div class="preson-box">
		<Header :title="title"/>
		<samePerson/>
		<div class="div">
			<div v-for="(item,index) in personData" :key="index">
				<numInput :numtitle="item.designation" :numinfor="item.numval"/>
			</div>
		</div>
	</div>
</template>

<script>
	import numInput from '../components/numInput.vue'
	import samePerson from '../components/samepreson.vue'
	import Header from '../components/Header.vue'
	
	export default{
		data(){
			return {
				title:'个人档案卡',
				personData:[
					{
						designation:'编号',
						numval:'PDB19881122HYLX' 
					},
					{
						designation:'昵称',
						numval:'球王' 
					},
					{
						designation:'头像',
						numval:'' 
					},
					{
						designation:'姓名',
						numval:'赵伟国' 
					},
					{
						designation:'性别',
						numval:'男' 
					},
					{
						designation:'生日',
						numval:'1998-01-23' 
					},
					{
						designation:'年龄',
						numval:'30' 
					},
					{
						designation:'民族',
						numval:'汉族' 
					},
					{
						designation:'职业',
						numval:'销售经理' 
					},
					{
						designation:'家庭住址',
						numval:'邯郸' 
					},
					{
						designation:'身份证号',
						numval:'420982198801236015' 
					},
				]
			}
		},
		components:{
			numInput,
			samePerson,
			Header
		},
	}
</script>

<style scoped>
	.preson{
		width: 100%;
		height: 100%;
		background: #F5F2F0;
	}
	.persontop{
		width: 100%;
		height: 111px;
		background: #fff;
	}
	.allperson{
		width: 92%;
		height: 100%;
		margin: auto;
		display: flex;
	}
	.personLest{
		width: 140px;
		height: 90px;
		border-radius: 10px;
		background: #333;
		text-align: center;
		line-height: 90px;
		font-size: 13px;
		margin: 0;
		padding: 0;
		float: left;
	}
	.personRight{
		width: 165px;
		height: 90px;
		float: right;
	}
	.personRight span{
		display: inline-block;
	}
	.edit,.approve{
		width: 70px;
		height: 30px;
		border-radius: 10px;
		background:#1177dc;
		color:#fff;
		font-size: 14px;
	}
	.approve{
		background:#ff6600;
	}
	.doneinfor span:nth-child(1){
		width: 118px;
		height: 14px;
		background: #333333;
	}
	.doneinfor span:nth-child(2){
		width: 42px;
		height: 11px;
		border:1px solid #333333;
	}
	
	
</style>
